<template>
  <view class="my">
    <view class="tbbj">
      <!--顶部个人信息页 -->
      <view class="dbgr">
        <van-image round width="100rpx" height="100rpx" src="https://img.yzcdn.cn/vant/cat.jpeg" />
        <view>司机</view>
        <view>司机编号:3070908035977857767</view>
        <view>手机号码:18877776666</view>
      </view>

    </view>
    <view class="foot-1">
      <view>-本月任务</view>
      <view class="rwxx">
        <view>
          <view>18</view>
          <view>任务总量</view>
        </view>
        <view>
          <view>16</view>
          <view>任务完成数</view>
        </view>
        <view>
          <view>4987</view>
          <view>运输里程(km)</view>
        </view>
      </view>
    </view>
    <view class="foot-2">
      <navigator url="" class="cl">车辆管理 <view>></view>
      </navigator>
      <navigator url="" class="cl">任务数据 <view>></view>
      </navigator>
      <navigator url="" class="cl">系统设置 <view>></view>
      </navigator>
    </view>
    <view class="foot">
    </view>
  </view>
</template>
<script>
export default {
  name: "",
  data() {
    return {};
  },
  created() {},
  computed: {},
  methods: {},
};
</script>
<style lang='scss'  scoped>
.my {
  width: 100%;
  height: 100%;
  /* background-color: #f4f4f4; */
  position: relative;
  background-color: #f4f4f4;
  box-sizing: border-box;
}

.tbbj {
  background-color: #ec4739;
  height: 400rpx;
  border-radius: 0 0 20% 20%;
  padding-top: 60rpx;
}

.dbgr {
  text-align: center;
  color: #fff;
}

.dbgr view {
  padding-top: 10rpx;
}

.foot {
  /* position: relative; */
  height: 800rpx;
  background-color: #f4f4f4;
}

.foot-1 {
  padding: 20rpx 5rpx 0;
  position: absolute;
  top: 370rpx;
  left: 40rpx;
  width: 90%;
  height: 250rpx;
  background-color: #ffffff;
  border-radius: 20rpx;
  text-align: center;
}

.rwxx {
  display: flex;
  justify-content: space-between;
  margin-top: 70rpx;
}

.foot-2 {
  padding: 20rpx 5rpx 0;
  position: absolute;
  top: 670rpx;
  left: 40rpx;
  width: 90%;
  height: 250rpx;
  background-color: #ffffff;
  border-radius: 20rpx;
  text-align: center;
}

.foot-2 navigator {
  margin-bottom: 20rpx;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10rpx;
}

.foot-2 navigator view {
  color: #bfc1ca;
}
</style>
